var socket = io.connect();

/**
 * 接收服务器发送过来的消息
 * 
 * @param callbacks A function, data：jsonObject -> 消息类型.消息
 */
//转发其他人的消息
socket.on('news', function(data) {
    var time = new Date().toLocaleTimeString();
    var msg = data.msg;
    var nickname = data.nickname;
    var color = data.color;
    var $message = $('<div>' + nickname + ' (' + time + ') ' + ': ' + msg + ' </div>');
    $($message).css('color', color);
    $('#content').append($message);
    updateScoll();
    // console.log(data);
    socket.emit('my other event', 'client connected');
});
//转发系统消息
socket.on('system', function(data) {
    var time = new Date().toLocaleTimeString();
    var msg = data.msg;
    var nickname = 'system';
    var $message = $('<div style="color:red">' + nickname + ' (' + time + ') ' + ': ' + msg + ' </div>');
    $('#content').append($message);
});
//更新在线人数消息
socket.on('onlineCount', function(data) {
    $('#onlineCount').html(data.onlineCount);
});

//发送消息
function sendMessage() {
    var time = new Date().toLocaleTimeString();
    // var msg = $('form textarea').val();
    //转义后的emoji和文字
    var msg = $('.emojionearea-editor').html();
    var $message = $('<div>' + nickname + ' (' + time + ') ' + ': ' + msg + ' </div>');
    var color = $("#colorStyle").val();
    $($message).css('color', color);
    $('#content').append($message);
    updateScoll();
    // 清空textarea
    // $('form textarea').val('');
    $('.emojionearea-editor').empty();
    socket.emit('message', {
        'msg': msg,
        'nickname': nickname,
        'color': color
    });
}

function clearScreen() {
    $("#content").empty();
}

function updateScoll() {
    var oldScoll = $("#content").scrollTop();
    var newScoll = Number(oldScoll) + 20;
    $("#content").scrollTop(newScoll);
}

function initNickname() {
    //显示模态窗口，输入用户名,屏蔽esc键和点击空白处modal
    $('#nicknameModal').modal({
        backdrop: 'static',
        keyboard: false
    });
    $('#addNickname').bind('click', function(event) {
        event.preventDefault();
        var value = $("#nickname").val();
        if (value == "") {
            $("#nickname").focus();
        } else {
            nickname = value;
            //将用户名传给服务器绑定
            socket.emit('init', {
                nickname: nickname
            });
            $('#nicknameModal').modal('hide');
        }
    });
    //回车事件绑定
    $('#nicknameModal').bind('keydown', function(event) {
        if (event.keyCode == "13") { //回车执行查询
            $('#addNickname').trigger('click');
        }
    });
    //获取输入焦点
    $('#nickname').focus();
}

function initBtnSub() {
    $('#btnSub').on('click', function() {
        var fulAvatarVal = $('#fulAvatar').val(),
            errorTip = '<div id="errorTip" class="alert alert-warning">{0}</div>';

        $("#errorTip,#alt_warning").remove();

        if (fulAvatarVal.length == 0) {
            // try {
            //     var str = errorTip.format('请选择要上传的文件');
            // } catch (e) {
            //     console.log(e);
            // }
            // $("#container").prepend(str);
            return false;
        }

        var extName = fulAvatarVal.substring(fulAvatarVal.lastIndexOf('.'), fulAvatarVal.length).toLowerCase();

        if (extName != '.png' && extName != '.jpg') {
            $("#container").prepend(errorTip.format('只支持png和jpg格式图片'));
            return false;
        }

        return true;
    })
}

// 页面初始化时加载
(function() {
    $('#submit').bind('click', sendMessage);
    $('#clearBtn').bind('click', clearScreen);
    //回车事件绑定
    $('#events-panels').bind('keydown', function(event) {
        if (event.keyCode == "13") { //回车执行提交
            event.preventDefault();
            var inputValue = $('.emojionearea-editor').html();
            //输出值不为空,提交到服务器
            if (inputValue != "") {
                $('#submit').click();
            } else {
                //bug:2016-7-28 contenteditable输入焦点事件这里无法触发 
                $('.emojionearea-editor').trigger('focused');
            }
        }
    });
    //设置用户名
    initNickname();
    //初始化上传文件
    initBtnSub();
    // function setNickname() {
    //     if (typeof(nickname) == 'undefined') {
    //         nickname = prompt("请输入一个用户名");
    //     }
    // }
    // var setNickname_interval_id = setInterval(setNickname);

    // function getNickname() {
    //     if (typeof(nickname) != 'undefined' && nickname !== null) {
    //         //将用户名传给服务器绑定
    //         socket.emit('init', {
    //             nickname: nickname
    //         });
    //         clearInterval(setNickname_interval_id);
    //         clearInterval(getNickname_interval_id);
    //     }
    // }
    // var getNickname_interval_id = setInterval(getNickname);
})();